<template>
  <div style="text-align: left">
    检查结果录入
  </div>
  <hr/>
  <div style="text-align: left">
    <el-form :inline="true" :model="formChecking">
      <el-form-item label="病历号">
        <el-input  placeholder="请输入患者病历号" clearable  v-model="formChecking.caseNumber"/>
      </el-form-item>
      <el-form-item label="患者姓名">
        <el-input  placeholder="请输入患者姓名" clearable v-model="formChecking.realName"/>
      </el-form-item>
      <el-form-item>
        <el-button type="success" @click="queryCheckingList">查询</el-button>
      </el-form-item>

    </el-form>
  </div>
  <hr/>
  <el-table :data="checkingList" style="width: 100%">
    <el-table-column prop="id" label="编号" width="180" />
    <el-table-column prop="realName" label="患者姓名" width="180" />
    <el-table-column prop="caseNumber" label="病历号" />
    <el-table-column prop="age" label="患者年龄" />
    <el-table-column prop="gender" label="性别" />
    <el-table-column>检查进行中</el-table-column>

  </el-table>
  <hr/>
  <div class="example-pagination-block">
    <el-pagination layout="prev, pager, next" :total="total" />
  </div>
  <hr/>
  <el-table :data="checkItemList" style="width: 100%"
            highlight-current-row
            @current-change="selectRow">

    <el-table-column prop="id" label="编号"/>
    <el-table-column prop="techName" label="检查名称"/>
    <el-table-column prop="techFormat" label="检查规格"/>
    <el-table-column prop="techPrice" label="单价"/>
    <el-table-column prop="priceType" label="费用类型"/>
  </el-table>
  <hr/>
  <div style="text-align: left">当前选中:{{techName}}</div>
  <hr/>
  <div style="text-align: left">
    确认检查医生和科室
    <el-form :inline="true"  class="demo-form-inline" :model="formNoCheck">

      <el-form-item label="检查科室" >
        <el-select placeholder="请选择" v-model="formNoCheck.departId" style="width: 200px">
          <el-option v-for="item in departList" :label="item.deptName"
                     :value="item.id" :key="item.id"></el-option>



        </el-select>
      </el-form-item>
      <el-form-item label="检查医生">
        <el-select placeholder="请选择" v-model="formNoCheck.empId" style="width: 200px">
          <el-option v-for="opt in empList" :label="opt.realname	"
                     :value="opt.id" :key="opt.id"></el-option>
        </el-select>
      </el-form-item>
      <hr/>
      <strong>输入检查结果</strong><br/>
      <el-form-item label="输入结果" style="width: 100%">
        <el-input style="width: 100%;height: 120px" v-model="formNoCheck.checkResult"></el-input>
      </el-form-item>
      <hr/>
      <el-form-item>
        <el-button type="primary" @click="submitResult">结果保存</el-button>
        <el-button>重置输入</el-button>
      </el-form-item>
    </el-form>

  </div>
</template>

<script setup>

import {onMounted, reactive, ref} from "vue";
import axios from "axios";
import {ElMessage} from "element-plus";
//定义输出患者查询列表的表单
const formChecking=reactive({
  caseNumber:'',
  realName:''
});
//定义正在进行检查的患者列表
const checkingList=ref([]);
//定义分页查询中数据总记录数
const total=ref();
//定义患者检查项列表
const checkItemList=ref([]);
//定义保存选中检查项的名字
const techName=ref();
//定义分配科室和医生的表单
const formNoCheck = reactive({
  departId:'',
  empId:'',
  checkResult:''
});

const empList = ref([]);
//定义集合保存科室列表
const departList = ref([]);

onMounted(()=>{
  getEmployee();
  getDepartment();
});

/*发送根据病历号和或者姓名查询正在进行患者列表*/
function queryCheckingList(){
  axios.get("http://localhost/his/queryChecking?caseNumber="
      +formChecking.caseNumber+"&realName="+formChecking.realName)
      .then((response)=>{
        checkingList.value=response.data.registers;
        total.value=response.data.total;
        if(response.data.registers.length!=0){
          loadCheckItem(); //患者信息加在完成后，在发送请求加载检查项信息
        }
      })
      .catch((error)=>{
        console.log(error);
      });
}

/*发送ajax请求据病历号和或者姓名查询患者检查项*/
function loadCheckItem(){
  axios.get("http://localhost/his/queryCheckList?"
      +formChecking.caseNumber+"&realName="+formChecking.realName)
      .then((response)=>{
        checkItemList.value=response.data;
      })
      .catch();
}
function selectRow(row){
  //console.log(row);
  formNoCheck.id=row.checkId; //给formNoCheck表单json对象扩展属性
  techName.value=row.techName
}
/*定义函数发生ajax请求获得医生数据*/
function getEmployee() {
  axios.get("http://localhost/his/initEmployee")
      .then((response) => {
        console.log(response.data)
        empList.value = response.data;

      })
      .catch((error) => {
        console.log(error);
      });
}

/*定义函数发生ajax请求，加载科室数据*/
function getDepartment() {
  console.log(formNoCheck)
  axios.get("http://localhost/his/initDepartment")
      .then((response) => {
        console.log(response.data)
        departList.value = response.data;

      })
      .catch((error) => {
        console.log(error);
      });
}

//发送ajax请求提交检查结果
function submitResult(){
  console.log(formNoCheck)
  axios.post("http://localhost/his/saveCheckResult",formNoCheck)
      .then((response)=>{
        ElMessage(response.data.msg);
      })
      .catch((error) => {
        console.log(error);
      });

}
</script>

<style scoped>

</style>